// pages/epi_5/animation/animation.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    tab1: true,
    tab2: false,
    duration: "",
    delay: "",
    tOrigin: "",
    timingFunction: ""
  },
  animation: null,
  show(e){
    if (e.target.id == 'btn1'){
      this.setData({
          tab1: true,
          tab2: false
      })
    } else {
      this.animation = wx.createAnimation({
          duration: this.data.duration,
          delay: this.data.delay,
          transformOrigin: this.data.transformOrigin,
          timingFunction: this.data.timingFunction
      })
      this.resetAni()
      this.setData({
          tab1: false,
          tab2: true,
          animation: this.animation.export()
      })  
    }
  },
  resetAni(){
    this.animation.rotate(0)
    .scale(1)
    .translate(0,0)
    .opacity(1)
    .step({duration:0})
  },
  run(e){
      switch(e.currentTarget.id){
          case 'rotate':
              this.animation.rotate(90).step()
              break
          case 'scale':
              this.animation.scale(2, 1.5).step({timingFunction:'linear'})
              this.animation.scale(1).step({timingFunction:'linear'})
              break
          case 'translate':
              this.animation.scale(0.5, 0.5).step()
              this.animation.translate(100, 100).step()
              this.animation.translate(-100, -100).step()
              this.animation.rotate(360).step()
            //   this.animation.scale(0.5, 0.5).translate(100, 100).step()
            //   this.animation.translate(-50, -50).rotate(360).step()
              break
          case 'skew':
              this.animation.skew(45).step()
              this.animation.skew(45, 45).step()
              break
          case 'opacity':
              this.animation.opacity(0.5).step()
              break
          case 'bgColor':
              this.animation.backgroundColor('#FF0000').step()
              this.animation.rotate(90).step()
              break
          case 'width':
              this.animation.width(300).step()
              break
          case 'top':
              this.animation.top(100).step()
              break

      }
      this.setData({
        animation: this.animation.export()
    })
  }
})